<template>
	<transition name="el-zoom-in-center">
		<div class="JNPF-preview-main">
			<div class="JNPF-common-page-header">
				<el-page-header @back="goBack" :content="!dataForm.id ? '新建' : isDetail ? '详情' : '编辑'"/>
				<div class="options">
					<el-button type="primary" @click="dataFormSubmit()" v-if="!isDetail">确 定</el-button>
					<el-button @click="goBack">取 消</el-button>
				</div>
			</div>
			<el-row :gutter="15"  class="main" :style="{margin: '0 auto',width:'100%'}">
				<el-form ref="elForm" :model="dataForm" size="medium" label-width="130px" label-position="right" :disabled="!!isDetail" :rules="rules">
					<template>
						<el-col :span="24">
							<el-form-item label-width="0">
								<groupTitle content-position="left" content="隐患上报"></groupTitle>
							</el-form-item>
						</el-col>
						<el-row>
							<el-col :span="12">
								<el-form-item label="风险点" prop="fxd" required >
									<el-input v-model="dataForm.fxd" placeholder="请选择风险点" disabled clearable :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
										<template slot="prepend"></template>
										<template slot="append"></template>
									</el-input>
								</el-form-item>
							</el-col>
							<!-- <el-col :span="8" style="margin-left:20px;">
								<el-button type="primary" @click="FxdSelect">
									选择
								</el-button>
								<el-button type="primary" @click="FxdClear">
									清空
								</el-button>
							</el-col> -->
						</el-row>
						<el-row>
							<el-col :span="24">
								<el-form-item label="排查项" prop="pcx" >
									<el-select v-model="dataForm.pcx" placeholder="请选择" disabled clearable :style='{"width":"100%"}' >
										<el-option v-for="(item, index) in pcxOptions" :key="index" :label="item.fullName" :value="item.id" ></el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="隐患名称" prop="yhmc" required >
									<el-input v-model="dataForm.yhmc" placeholder="请输入" disabled clearable :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
										<template slot="prepend"></template>
										<template slot="append"></template>
									</el-input>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="隐患描述" prop="yhms" >
									<el-input v-model="dataForm.yhms" placeholder="请输入" disabled show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":1000}' >
									</el-input>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="隐患责任部门" prop="yhzrbm" required >
									<el-select v-model="dataForm.yhzrbm" placeholder="请选择" disabled clearable :style='{"width":"100%"}' filterable>
										<el-option v-for="(item, index) in yhzrbmOptions" :key="index" :label="item.F_FullName" :value="item.F_Id" ></el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="隐患地点" prop="yhdd" required >
									<el-select v-model="dataForm.yhdd" placeholder="请选择" disabled clearable :style='{"width":"100%"}' >
										<el-option v-for="(item, index) in yhddOptions" :key="index" :label="item.MC" :value="item.ID" ></el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="现场照片" prop="xczp" required >
									<JNPF-UploadImg v-model="xczpList" accept="" disabled :fileSize="20" sizeUnit="MB" :limit="9" >
									</JNPF-UploadImg>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="隐患上报人" prop="yhsbr" required >
									<el-select v-model="dataForm.yhsbr" placeholder="请选择" disabled clearable :style='{"width":"100%"}' filterable>
										<el-option v-for="(item, index) in yhsbrOptions" :key="index" :label="item.F_RealName" :value="item.F_Id" ></el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="隐患上报时间" prop="sbsj" required >
									<el-date-picker v-model="dataForm.sbsj" placeholder="请选择" disabled clearable :style='{"width":"100%"}' type="datetime" format="yyyy-MM-dd HH:mm:ss" value-format="timestamp" >
									</el-date-picker>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="判定人" prop="pdr" required >
									<el-select v-model="dataForm.pdr" placeholder="请选择" disabled clearable :style='{"width":"100%"}' filterable>
										<el-option v-for="(item, index) in pdrOptions" :key="index" :label="item.F_RealName" :value="item.F_Id" ></el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="24" v-if="isShowHcr">
								<el-form-item label="是否为隐患" prop="sfwyh" required >
									<el-select v-model="dataForm.sfwyh" placeholder="请选择" disabled clearable :style='{"width":"100%"}' >
										<el-option v-for="(item, index) in sfwyhOptions" :key="index" :label="item.fullName" :value="item.id" ></el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="24" v-if="isShowHcr">
								<el-form-item label="隐患核查人" prop="yhhcr" required >
									<el-select v-model="dataForm.yhhcr" placeholder="请选择" disabled clearable :style='{"width":"100%"}' filterable>
										<el-option v-for="(item, index) in yhhcrOptions" :key="index" :label="item.F_RealName" :value="item.F_Id" ></el-option>
									</el-select>
								</el-form-item>
							</el-col>
						</el-row>
					</template>
					<template>
						<el-col :span="24">
							<el-form-item label-width="0">
								<groupTitle content-position="left" content="隐患核查"></groupTitle>
							</el-form-item>
						</el-col>
						<el-row>
							<el-col :span="24">
								<el-form-item label="隐患核查意见" prop="hcyj" >
									<el-input v-model="dataForm.hcyj" placeholder="请输入" disabled show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":1000}' >
									</el-input>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="隐患核查结果" prop="hcjg" required >
									<el-input v-model="dataForm.hcjg" placeholder="请输入" disabled clearable :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
										<template slot="prepend"></template>
										<template slot="append"></template>
									</el-input>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="隐患治理措施" prop="yhzlcs" >
									<el-input v-model="dataForm.yhzlcs" placeholder="请输入" disabled show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":1000}' >
									</el-input>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="隐患核查部门" prop="yhhcbm" >
									<el-select v-model="dataForm.yhhcbm" placeholder="请选择" disabled clearable :style='{"width":"100%"}' filterable>
										<el-option v-for="(item, index) in yhhcbmOptions" :key="index" :label="item.F_FullName" :value="item.F_Id" ></el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="隐患整改责任人" prop="yhzgzrr" >
									<el-select v-model="dataForm.yhzgzrr" placeholder="请选择" disabled clearable :style='{"width":"100%"}' filterable>
										<el-option v-for="(item, index) in yhzgzrrOptions" :key="index" :label="item.F_RealName" :value="item.F_Id " ></el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="隐患核查日期" prop="yhhcsj" >
									<el-date-picker v-model="dataForm.yhhcsj" placeholder="请选择" disabled clearable :style='{"width":"100%"}' type="date" format="yyyy-MM-dd" value-format="timestamp" >
									</el-date-picker>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="完成期限" prop="wcqx" >
									<el-date-picker v-model="dataForm.wcqx" placeholder="请选择" disabled clearable :style='{"width":"100%"}' type="datetime" format="yyyy-MM-dd HH:mm:ss" value-format="timestamp" >
									</el-date-picker>
								</el-form-item>
							</el-col>
						</el-row>
					</template>
					<template>
						<el-col :span="24">
							<el-form-item label-width="0">
								<groupTitle content-position="left" content="隐患整改"></groupTitle>
							</el-form-item>
						</el-col>
						<el-row>
							<el-col :span="24">
								<el-form-item label="隐患整改情况" prop="zgqk" >
									<el-input v-model="dataForm.zgqk" placeholder="请输入" show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":1000}' >
									</el-input>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="隐患整改资金" prop="zgzj" >
									<el-input v-model="dataForm.zgzj" placeholder="请输入" clearable :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
										<template slot="prepend"></template>
										<template slot="append"></template>
									</el-input>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="隐患整改部门" prop="zgbm" >
									<el-select v-model="dataForm.zgbm" placeholder="请选择" clearable :style='{"width":"100%"}' filterable>
										<el-option v-for="(item, index) in zgbmOptions" :key="index" :label="item.F_FullName" :value="item.F_Id  " ></el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="隐患整改后图片" prop="zgzp" >
									<JNPF-UploadImg v-model="zgzpList" accept="" :fileSize="20" sizeUnit="MB" :limit="9" >
									</JNPF-UploadImg>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="隐患整改措施" prop="zgcs" >
									<el-input v-model="dataForm.zgcs" placeholder="请输入" show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":1000}' >
									</el-input>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="隐患验收人" prop="yhysr" >
									<el-select v-model="dataForm.yhysr" placeholder="请选择" clearable :style='{"width":"100%"}' filterable>
										<el-option v-for="(item, index) in yhysrOptions" :key="index" :label="item.F_RealName" :value="item.F_Id  " ></el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="隐患整改时间" prop="yhzgsj" >
									<el-date-picker v-model="dataForm.yhzgsj" placeholder="请选择" clearable :style='{"width":"100%"}' type="datetime" format="yyyy-MM-dd HH:mm:ss" value-format="timestamp" >
									</el-date-picker>
								</el-form-item>
							</el-col>
						</el-row>
					</template>
					<template v-if="isShow">
						<el-col :span="24">
							<el-form-item label-width="0">
								<groupTitle content-position="left" content="隐患验收"></groupTitle>
							</el-form-item>
						</el-col>
						<el-row>
							<el-col :span="24">
								<el-form-item label="验收意见" prop="ysyj" >
									<el-input v-model="dataForm.ysyj" placeholder="请输入" show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":1000}' >
									</el-input>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="验收结果" prop="ysjg" >
									<el-select v-model="dataForm.ysjg" placeholder="请选择" clearable :style='{"width":"100%"}' >
										<el-option v-for="(item, index) in ysjgOptions" :key="index" :label="item.fullName" :value="item.id" ></el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="验收文件上传" prop="yswj" >
									<JNPF-UploadFz v-model="yswjList" accept="" :fileSize="20" sizeUnit="MB" :limit="9" buttonText="点击上传" >
									</JNPF-UploadFz>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="验收时间" prop="yssj" >
									<el-date-picker v-model="dataForm.yssj" placeholder="请选择" clearable :style='{"width":"100%"}' type="datetime" format="yyyy-MM-dd HH:mm:ss" value-format="timestamp" >
									</el-date-picker>
								</el-form-item>
							</el-col>
							<el-col :span="24">
								<el-form-item label="隐患状态" prop="yhzt" >
									<el-select v-model="dataForm.yhzt" placeholder="请选择" clearable :style='{"width":"100%"}' >
										<el-option v-for="(item, index) in yhztOptions" :key="index" :label="item.fullName" :value="item.id" ></el-option>
									</el-select>
								</el-form-item>
							</el-col>
						</el-row>
					</template>	
				</el-form>
			</el-row>
		</div>
	</transition>

</template>
<script>
import { mapGetters } from 'vuex'
import request from '@/utils/request'
import {getDictionaryDataSelector}from '@/api/systemData/dictionary'
import {previewDataInterface}from '@/api/systemData/dataInterface'
  export default {
	computed: {
    	...mapGetters(['userInfo'])
  	},
    data() {
      return {
		  isShowHcr:false,
		  isShow:false,
		//   fxdsBoxVisible: false,  //-
        visible: false,
        isDetail: false,
        dataForm: {
					fxd:undefined,
					pcx:undefined,
					yhmc:undefined,
					yhms:undefined,
					yhzrbm:undefined,
					yhdd:undefined,
					xczp:[],
					yhsbr:undefined,
					yhhcr:undefined,
					sbsj:undefined,
					pdr:undefined,
					sfwyh:undefined,
					hcyj:undefined,
					hcjg:undefined,
					yhzlcs:undefined,
					yhhcbm:undefined,
					yhzgzrr:undefined,
					yhhcsj:undefined,
					wcqx:undefined,
					zgqk:undefined,
					zgzj:undefined,
					zgbm:undefined,
					zgzp:[],
					zgcs:undefined,
					yhysr:undefined,
					yhzgsj:undefined,
					ysyj:undefined,
					ysjg:undefined,
					yswj:[],
					yssj:undefined,
					yhzt:undefined,

        },
        rules: {
						fxd:[
						{
							required:true,
							message:'请输入风险点',
							trigger:'blur'
						},
						],
						// pcx:[
						// {
						// 	required:true,
						// 	message:'请输入排查项',
						// 	trigger:'blur'
						// },
						// ],
						yhmc:[
						{
							required:true,
							message:'请输入隐患名称',
							trigger:'blur'
						},
						],
						// yhms:[
						// {
						// 	required:true,
						// 	message:'请输入隐患描述',
						// 	trigger:'blur'
						// },
						// ],
						yhzrbm:[
						{
							required:true,
							message:'请输入隐患责任部门',
							trigger:'blur'
						},
						],
						yhdd:[
						{
							required:true,
							message:'请输入隐患地点',
							trigger:'blur'
						},
						],
						xczp:[
						{
							required:true,
							message:'请输入现场照片',
							trigger:'blur'
						},
						],
						yhsbr:[
						{
							required:true,
							message:'请输入隐患上报人',
							trigger:'blur'
						},
						],
						yhhcr:[
						{
							required:true,
							message:'请输入隐患核查人',
							trigger:'blur'
						},
						],
						sbsj:[
						{
							required:true,
							message:'请输入隐患上报时间',
							trigger:'blur'
						},
						],
						pdr:[
						{
							required:true,
							message:'请输入判定人',
							trigger:'blur'
						},
						],
						sfwyh:[
						{
							required:true,
							message:'请输入是否为隐患',
							trigger:'blur'
						},
						],
						hcyj:[
						{
							required:true,
							message:'请输入隐患核查意见',
							trigger:'blur'
						},
						],
						hcjg:[
						{
							required:true,
							message:'请输入隐患核查结果',
							trigger:'blur'
						},
						],
						yhzlcs:[
						{
							required:true,
							message:'请输入隐患治理措施',
							trigger:'blur'
						},
						],
						yhhcbm:[
						{
							required:true,
							message:'请输入隐患核查部门',
							trigger:'blur'
						},
						],
						yhzgzrr:[
						{
							required:true,
							message:'请输入隐患整改责任人',
							trigger:'blur'
						},
						],
						yhhcsj:[
						{
							required:true,
							message:'请输入隐患核查日期',
							trigger:'blur'
						},
						],
						wcqx:[
						{
							required:true,
							message:'请输入完成期限',
							trigger:'blur'
						},
						],
						zgqk:[
						{
							required:true,
							message:'请输入隐患整改情况',
							trigger:'blur'
						},
						],
						zgzj:[
						{
							required:true,
							message:'请输入隐患整改资金',
							trigger:'blur'
						},
						],
						zgbm:[
						{
							required:true,
							message:'请输入隐患整改部门',
							trigger:'blur'
						},
						],
						zgzp:[
						{
							required:true,
							message:'请输入隐患整改后图片',
							trigger:'blur'
						},
						],
						zgcs:[
						{
							required:true,
							message:'请输入隐患整改措施',
							trigger:'blur'
						},
						],
						yhysr:[
						{
							required:true,
							message:'请输入隐患验收人',
							trigger:'blur'
						},
						],
						yhzgsj:[
						{
							required:true,
							message:'请输入隐患整改时间',
							trigger:'blur'
						},
						],
						ysyj:[
						{
							required:true,
							message:'请输入验收意见',
							trigger:'blur'
						},
						],
						ysjg:[
						{
							required:true,
							message:'请输入验收结果',
							trigger:'blur'
						},
						],
						yswj:[
						{
							required:true,
							message:'请输入验收文件上传',
							trigger:'blur'
						},
						],
						yssj:[
						{
							required:true,
							message:'请输入验收时间',
							trigger:'blur'
						},
						],
						yhzt:[
						{
							required:true,
							message:'请输入隐患状态',
							trigger:'blur'
						},
						],

        },
				pcxOptions:[],
				yhzrbmOptions:[],
				yhddOptions:[],
				yhsbrOptions:[],
				yhhcrOptions:[],
				pdrOptions:[],
				sfwyhOptions:[{"fullName":"是","id":"0"},{"fullName":"否","id":"1"}],
				yhhcbmOptions:[],
				yhzgzrrOptions:[],
				zgbmOptions:[],
				yhysrOptions:[],
				ysjgOptions:[{"fullName":"不通过","id":"0"},{"fullName":"通过","id":"1"}],
				yhztOptions:[{"fullName":"待判定","id":"0"},{"fullName":"未构成隐患","id":"1"},{"fullName":"待核查","id":"2"},{"fullName":"待整改","id":"3"},{"fullName":"待验收","id":"4"},{"fullName":"验收通过","id":"5"},{"fullName":"验收未通过","id":"6"}],

					xczpList:[],
					zgzpList:[],
					yswjList:[],

      }
    },
    created() {
		this.getyhzrbmOptions();
		this.getyhsbrOptions();
		this.getyhddOptions();
		this.getyhhcrOptions();
		this.getpdrOptions();
		this.getyhhcbmOptions();
		this.getyhzgzrrOptions();
		this.getzgbmOptions();
		this.getyhysrOptions();

    },
    methods: {
		getyhzrbmOptions()
		{
			previewDataInterface('772d2cbcadd24df79243e3d92ef5f690').then(res => {
				this.yhzrbmOptions = res.data
				if(this.dataForm.yhzrbm == undefined){
					let list = this.yhzrbmOptions;
					let that = this;
					if(list.length > 0){
						for(let i = 0;i<list.length;i++){
							if(list[i].F_Id == that.userInfo.departmentId){
								that.dataForm.yhzrbm = list[i].F_Id;
							}
						}
					}
				}
			})
		},
		getyhsbrOptions()
		{
			previewDataInterface('8bca424f16d6448ab09e57a028853aa9').then(res => {
				this.yhsbrOptions = res.data
				if(this.dataForm.yhsbr == undefined){
					let list = this.yhsbrOptions;
					let that = this;
					if(list.length > 0){
						for(let i = 0;i<list.length;i++){
							if(list[i].F_Id == that.userInfo.userId){
								that.dataForm.yhsbr = list[i].F_Id;
								// console.log(that.dataForm.yhsbr);
							}
						}
					}
				}
			})
		},
		getyhddOptions()
		{
			previewDataInterface('e7b2c31f5a7147c08629c5409dd7fdf4').then(res => {
				this.yhddOptions = res.data
			})
		},
		getyhhcrOptions()
		{
			previewDataInterface('8bca424f16d6448ab09e57a028853aa9').then(res => {
				this.yhhcrOptions = res.data
			})
		},
		getpdrOptions()
		{
			previewDataInterface('8bca424f16d6448ab09e57a028853aa9').then(res => {
				this.pdrOptions = res.data
			})
		},
		getyhhcbmOptions()
		{
			previewDataInterface('772d2cbcadd24df79243e3d92ef5f690').then(res => {
				this.yhhcbmOptions = res.data
			})
		},
		getyhzgzrrOptions()
		{
			previewDataInterface('8bca424f16d6448ab09e57a028853aa9').then(res => {
				this.yhzgzrrOptions = res.data
			})
		},
		getzgbmOptions()
		{
			previewDataInterface('772d2cbcadd24df79243e3d92ef5f690').then(res => {
				this.zgbmOptions = res.data
			})
		},
		getyhysrOptions()
		{
			previewDataInterface('8bca424f16d6448ab09e57a028853aa9').then(res => {
				this.yhysrOptions = res.data
			})
		},

           goBack() {
                    this.$emit('refresh')
                },
		init(id, isDetail) {

			this.dataForm.id = id || 0;
			this.visible = true;
			this.isDetail = isDetail || false;
			this.$nextTick(() => {
			this.$refs['elForm'].resetFields();
				if (this.dataForm.id) {
					request({
					url: '/api/System/qyaqscYhpcxx/' + this.dataForm.id,
					method: 'get'
					}).then(res =>{
						this.dataForm = res.data;
						this.xczpList = this.dataForm.xczp ? JSON.parse(this.dataForm.xczp) : [];
						this.zgzpList = this.dataForm.zgzp ? JSON.parse(this.dataForm.zgzp) : [];
						this.yswjList = this.dataForm.yswj ? JSON.parse(this.dataForm.yswj) : [];
						if(this.dataForm.sfwyh !== undefined){
							this.isShowHcr = true;
						}
					})
				}
			})
		},
		// 表单提交
		dataFormSubmit() {
					this.$set(this.dataForm, 'xczp', JSON.stringify(this.xczpList));
					this.$set(this.dataForm, 'zgzp', JSON.stringify(this.zgzpList));
					this.$set(this.dataForm, 'yswj', JSON.stringify(this.yswjList));

			this.$refs['elForm'].validate((valid) => {
			if (valid) {
				let query = {
					...this.dataForm,
					yhzt: '4'
				}
				request({
					url: '/api/System/qyaqscYhpcxx/' + this.dataForm.id,
					method: 'PUT',
					data: query
				}).then((res) =>{
					this.$message({
					message: res.msg,
					type: 'success',
					duration: 1000,
					onClose: () =>{
						this.visible = false;
						this.$emit('refresh', true);
					}
					})
				})
			}
			})
		},
		initListFxd(list) {
			this.pcxOptions = [];
			this.dataForm.fxd = list.mc;
			this.initPcx(list.id,list.lx);
		},
		initPcx(qyid,lx1){
			request({
					url: '/api/System/YHPCXXFXD/' + qyid + '/' + lx1,
					method: 'GET',
				}).then(res => {
					let list = res.data;
					if(list.length > 0){
						for(let i=0;i<list.length;i++){
							if(list[i].lx == '设备设施'){
								this.pcxOptions.push({"fullName":list[i].jcxm,"id":list[i].jcxm});
							}else if(list[i].lx == '作业活动'){
								this.pcxOptions.push({"fullName":list[i].zybz,"id":list[i].zybz});
							}else if(list[i].lx == '工艺节点'){
								this.pcxOptions.push({"fullName":list[i].jd,"id":list[i].jd});
							}
						}
					}
					
			})  
		}

    }
  }
</script>